// 导入路由
import { Router, Route, Switch, Redirect } from 'react-router-dom'
import { customHistory } from './utils/history'

// 导入页面组件
import Login from './pages/Login'
import Layout from './pages/Layout'
import ProfileEdit from './pages/Profile/Edit'
import Article from './pages/ArticleDetail'
import Search from './pages/Search'
import SearchResult from './pages/Search/Result'
import Chat from './pages/Profile/Chat'

import './App.css'
import { AuthRoute } from './components/auth'
import { KeepAlive } from './components/keepalive'

// 配置路由规则
function App() {
  return (
    <Router history={customHistory}>
      <div className="app">
        {/* 缓存layout */}
        <KeepAlive path="/home" Component={Layout}>
          <Layout />
        </KeepAlive>
        <Switch>
          <Redirect exact from="/" to="/home" />
          {/* <Route path="/home" component={Layout} /> */}
          <Route path="/login" component={Login} />
          {/* <Route path="/profile/edit">
            <ProfileEdit />
          </Route> */}
          <AuthRoute path="/profile/edit">
            <ProfileEdit />
          </AuthRoute>
          <Route path="/article/:artId">
            <Article />
          </Route>
          {/* 搜索 */}
          <Route exact path="/search">
            <Search />
          </Route>
          <Route path="/search/result">
            <SearchResult />
          </Route>
          {/* 小智 */}
          <AuthRoute path="/chat">
            <Chat />
          </AuthRoute>
        </Switch>
      </div>
    </Router>
  )
}

export default App
